;(function(){
    //3实例化
 let myChart = echarts.init(document.querySelector(".box-left3"));
 let option = {
   xAxis: [
     {
       type: "category",
       data: ["水象", "土象", "风象", "火象",],
     },
   ],
   yAxis: [
     {
       type: "value",
       name: "占比",
       axisLine: { show: true },
       axisTick: { show: true },
       splitLine: { show: false },
       max: 50,
       min: 0,
     },
    //  {
    //    type: "value",
    //    name: "完成率",
    //    axisLine: { show: true },
    //    axisTick: { show: true },
    //    splitLine: { show: false },
    //    max: 100,
    //    min: 0,
    //  },
   ],
   //grid
   grid: {
       
       bottom: 10,
       containLabel: true,
     },
   //图列
   legend:{
       top:20,
       data:['比例','渣率']
   },
   //~~~~~~~~~~~~~~~~~~~~~~~~~~~~
   series:[
       {
           type:'bar',
           name:'比例',
           data:[11,22,33,14],
           //柱状图无缝隙
           barGap:"0",
           itemStyle: {
                   normal: {
                       //渐变色
                       color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                           offset: 0,
                           color: 'red'
                       }, {
                           offset: 1,
                           color: 'green'
                       }]),
                   }
               },
       },
       
       {
           type:'line',
           name:'渣率',
           data:[30,22,40,14],
           //折线图丝滑
           smooth:true
       },
   ]
 };
 myChart.setOption(option);
 //自适应
 window.addEventListener('resize',()=>{
   myChart.resize()

 })
})()